<!DOCTYPE html>
<html  lang="en">
    <head>
        <title>Document</title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    </head>
    <body>
        <div id="app">
            <div>子组件</div>
            <child :childmsg="childmsg"></child>
			
			<div>父组件</div>
			<textarea v-model="parentmsg"></textarea>			<br>
			
			
			<button @click="childmsg = parentmsg">发送</button>
        </div>

        <script>
            Vue.component("child",
                {
                    template: `<textarea v-model="childmsg"></textarea>`,
                    props: {                        // 向下传props,向上传$emit
                        childmsg: String,                // 对传入的数据进行类型检查
                    }
                }
            )
            let vm = new Vue({
                el: '#app',
                data: {
					childmsg: '',
                    parentmsg: 'How are you?',
                },
            })
        </script>
    </body>
</html>